extends ../_layout/default.pug

block styles
  link(href='node_modules/@coreui/chartjs/dist/css/coreui-chartjs.css', rel='stylesheet')

block scripts
  if !starter
    // Plugins and scripts required by this view
    script(src='node_modules/chart.js/dist/chart.umd.js')
    script(src='node_modules/@coreui/chartjs/dist/js/coreui-chartjs.js')
    script(src='node_modules/@coreui/utils/dist/umd/index.js')
    script(src='js/main.js')

block breadcrumb
    +breadcrumb(
    [
      { href: '#', label: 'Home'},
      { label: 'Dashboard'}
    ]
  )

block view
  .row.g-4.mb-4
    .col-sm-6.col-xl-3
      .card.text-white.bg-primary
        .card-body.pb-0.d-flex.justify-content-between.align-items-start
          div
            .fs-4.fw-semibold 26K 
              span.fs-6.fw-normal (-12.4%
                svg.icon
                  use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-arrow-bottom")
                | )
            div Users
          .dropdown
            button.btn.btn-transparent.text-white.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
              svg.icon
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                |
            .dropdown-menu.dropdown-menu-end
              a.dropdown-item(href='#') Action
              a.dropdown-item(href='#') Another action
              a.dropdown-item(href='#') Something else here
        .c-chart-wrapper.mt-3.mx-3(style='height:70px;')
          canvas#card-chart1.chart(height='70')
    // /.col
    .col-sm-6.col-xl-3
      .card.text-white.bg-info
        .card-body.pb-0.d-flex.justify-content-between.align-items-start
          div
            .fs-4.fw-semibold $6.200 
              span.fs-6.fw-normal (40.9%
                svg.icon
                  use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-arrow-top")
                | )
            div Income
          .dropdown
            button.btn.btn-transparent.text-white.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
              svg.icon
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
            .dropdown-menu.dropdown-menu-end
              a.dropdown-item(href='#') Action
              a.dropdown-item(href='#') Another action
              a.dropdown-item(href='#') Something else here
        .c-chart-wrapper.mt-3.mx-3(style='height:70px;')
          canvas#card-chart2.chart(height='70')
    // /.col
    .col-sm-6.col-xl-3
      .card.text-white.bg-warning
        .card-body.pb-0.d-flex.justify-content-between.align-items-start
          div
            .fs-4.fw-semibold 2.49% 
              span.fs-6.fw-normal (84.7%
                svg.icon
                  use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-arrow-top")
                | )
            div Conversion Rate
          .dropdown
            button.btn.btn-transparent.text-white.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
              svg.icon
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
            .dropdown-menu.dropdown-menu-end
              a.dropdown-item(href='#') Action
              a.dropdown-item(href='#') Another action
              a.dropdown-item(href='#') Something else here
        .c-chart-wrapper.mt-3(style='height:70px;')
          canvas#card-chart3.chart(height='70')
    // /.col
    .col-sm-6.col-xl-3
      .card.text-white.bg-danger
        .card-body.pb-0.d-flex.justify-content-between.align-items-start
          div
            .fs-4.fw-semibold 44K 
              span.fs-6.fw-normal (-23.6%
                svg.icon
                  use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-arrow-bottom")
                | )
            div Sessions
          .dropdown
            button.btn.btn-transparent.text-white.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
              svg.icon
                use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
            .dropdown-menu.dropdown-menu-end
              a.dropdown-item(href='#') Action
              a.dropdown-item(href='#') Another action
              a.dropdown-item(href='#') Something else here
        .c-chart-wrapper.mt-3.mx-3(style='height:70px;')
          canvas#card-chart4.chart(height='70')
    // /.col
  // /.row
  .card.mb-4
    .card-body
      .d-flex.justify-content-between
        div
          h4.card-title.mb-0 Traffic
          .small.text-body-secondary January - July 2023
        .btn-toolbar.d-none.d-md-block(role='toolbar' aria-label='Toolbar with buttons')
          .btn-group.btn-group-toggle.mx-3(data-coreui-toggle='buttons')
            input.btn-check#option1(type='radio', name='options', autocomplete='off')
            label.btn.btn-outline-secondary
              |  Day
            input.btn-check#option2(type='radio', name='options', autocomplete='off', checked='')
            label.btn.btn-outline-secondary.active
              |  Month
            input.btn-check#option3(type='radio', name='options', autocomplete='off')
            label.btn.btn-outline-secondary
              |  Year
          button.btn.btn-primary(type='button')
            svg.icon
              use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-cloud-download")
      .c-chart-wrapper(style='height:300px;margin-top:40px;')
        canvas#main-chart.chart(height='300')
    .card-footer
      .row.row-cols-1.row-cols-sm-2.row-cols-lg-4.row-cols-xl-5.g-4.mb-2.text-center
        .col
          .text-body-secondary Visits
          .fw-semibold.text-truncate 29.703 Users (40%)
          .progress.progress-thin.mt-2
            .progress-bar.bg-success(role='progressbar', style='width: 40%', aria-valuenow='40', aria-valuemin='0', aria-valuemax='100')
        .col
          .text-body-secondary Unique
          .fw-semibold.text-truncate 24.093 Users (20%)
          .progress.progress-thin.mt-2
            .progress-bar.bg-info(role='progressbar', style='width: 20%', aria-valuenow='20', aria-valuemin='0', aria-valuemax='100')
        .col
          .text-body-secondary Pageviews
          .fw-semibold.text-truncate 78.706 Views (60%)
          .progress.progress-thin.mt-2
            .progress-bar.bg-warning(role='progressbar', style='width: 60%', aria-valuenow='60', aria-valuemin='0', aria-valuemax='100')
        .col
          .text-body-secondary New Users
          .fw-semibold.text-truncate 22.123 Users (80%)
          .progress.progress-thin.mt-2
            .progress-bar.bg-danger(role='progressbar', style='width: 80%', aria-valuenow='80', aria-valuemin='0', aria-valuemax='100')
        .col.d-none.d-xl-block
          .text-body-secondary Bounce Rate
          .fw-semibold.text-truncate 40.15%
          .progress.progress-thin.mt-2
            .progress-bar(role='progressbar', style='width: 40%', aria-valuenow='40', aria-valuemin='0', aria-valuemax='100')
  // /.card
  .row.g-4.mb-4
    .col-sm-6.col-lg-4
      .card(style='--cui-card-cap-bg: #3b5998')
        .card-header.position-relative.d-flex.justify-content-center.align-items-center
          svg.icon.icon-3xl.text-white.my-4
            use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-facebook-f")
          .chart-wrapper.position-absolute.top-0.start-0.w-100.h-100
            canvas#social-box-chart-1(height='90')
        .card-body.row.text-center
          .col
            .fs-5.fw-semibold 89k
            .text-uppercase.text-body-secondary.small friends
          .vr
          .col
            .fs-5.fw-semibold 459
            .text-uppercase.text-body-secondary.small feeds
    // /.col
    .col-sm-6.col-lg-4
      .card(style='--cui-card-cap-bg: #00aced')
        .card-header.position-relative.d-flex.justify-content-center.align-items-center
          svg.icon.icon-3xl.text-white.my-4
            use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-twitter")
          .chart-wrapper.position-absolute.top-0.start-0.w-100.h-100
            canvas#social-box-chart-2(height='90')
        .card-body.row.text-center
          .col
            .fs-5.fw-semibold 973k
            .text-uppercase.text-body-secondary.small followers
          .vr
          .col
            .fs-5.fw-semibold 1.792
            .text-uppercase.text-body-secondary.small tweets
    // /.col
    .col-sm-6.col-lg-4
      .card(style='--cui-card-cap-bg: #4875b4')
        .card-header.position-relative.d-flex.justify-content-center.align-items-center
          svg.icon.icon-3xl.text-white.my-4
            use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-linkedin")
          .chart-wrapper.position-absolute.top-0.start-0.w-100.h-100
            canvas#social-box-chart-3(height='90')
        .card-body.row.text-center
          .col
            .fs-5.fw-semibold 500+
            .text-uppercase.text-body-secondary.small contacts
          .vr
          .col
            .fs-5.fw-semibold 292
            .text-uppercase.text-body-secondary.small feeds
    // /.col
  // /.row
  .row
    .col-md-12
      .card.mb-4
        .card-header
          | Traffic &amp; Sales
        .card-body
          .row
            .col-sm-6
              .row
                .col-6
                  .border-start.border-start-4.border-start-info.px-3.mb-3
                    .small.text-body-secondary.text-truncate New Clients
                    .fs-5.fw-semibold 9.123
                // /.col
                .col-6
                  .border-start.border-start-4.border-start-danger.px-3.mb-3
                    .small.text-body-secondary.text-truncate Recuring Clients
                    .fs-5.fw-semibold 22.643
                // /.col
              // /.row
              hr.mt-0
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Monday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 34%', aria-valuenow='34', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 78%', aria-valuenow='78', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Tuesday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 56%', aria-valuenow='56', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 94%', aria-valuenow='94', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Wednesday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 12%', aria-valuenow='12', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 67%', aria-valuenow='67', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Thursday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 43%', aria-valuenow='43', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 91%', aria-valuenow='91', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Friday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 22%', aria-valuenow='22', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 73%', aria-valuenow='73', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Saturday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 53%', aria-valuenow='53', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 82%', aria-valuenow='82', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-4
                .progress-group-prepend
                  span.text-body-secondary.small
                    | Sunday
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-info(role='progressbar', style='width: 9%', aria-valuenow='9', aria-valuemin='0', aria-valuemax='100')
                  .progress.progress-thin
                    .progress-bar.bg-danger(role='progressbar', style='width: 69%', aria-valuenow='69', aria-valuemin='0', aria-valuemax='100')
            // /.col
            .col-sm-6
              .row
                .col-6
                  .border-start.border-start-4.border-start-warning.px-3.mb-3
                    .small.text-body-secondary.text-truncate Pageviews
                    .fs-5.fw-semibold 78.623
                // /.col
                .col-6
                  .border-start.border-start-4.border-start-success.px-3.mb-3
                    .small.text-body-secondary.text-truncate Organic
                    .fs-5.fw-semibold 49.123
                // /.col
              // /.row
              hr.mt-0
              .progress-group
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-user")
                  div Male
                  .ms-auto.fw-semibold 43%
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-warning(role='progressbar', style='width: 43%', aria-valuenow='43', aria-valuemin='0', aria-valuemax='100')
              .progress-group.mb-5
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-user-female")
                  div Female
                  .ms-auto.fw-semibold 37%
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-warning(role='progressbar', style='width: 43%', aria-valuenow='43', aria-valuemin='0', aria-valuemax='100')
              .progress-group
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-google")
                  div Organic Search
                  .ms-auto.fw-semibold.me-2 191.235
                  .text-body-secondary.small (56%)
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-success(role='progressbar', style='width: 56%', aria-valuenow='56', aria-valuemin='0', aria-valuemax='100')
              .progress-group
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-facebook-f")
                  div Facebook
                  .ms-auto.fw-semibold.me-2 51.223
                  .text-body-secondary.small (15%)
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-success(role='progressbar', style='width: 15%', aria-valuenow='15', aria-valuemin='0', aria-valuemax='100')
              .progress-group
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-twitter")
                  div Twitter
                  .ms-auto.fw-semibold.me-2 37.564
                  .text-body-secondary.small (11%)
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-success(role='progressbar', style='width: 11%', aria-valuenow='11', aria-valuemin='0', aria-valuemax='100')
              .progress-group
                .progress-group-header
                  svg.icon.icon-lg.me-2
                    use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-linkedin")
                  div LinkedIn
                  .ms-auto.fw-semibold.me-2 27.319
                  .text-body-secondary.small (8%)
                .progress-group-bars
                  .progress.progress-thin
                    .progress-bar.bg-success(role='progressbar', style='width: 8%', aria-valuenow='8', aria-valuemin='0', aria-valuemax='100')
            // /.col
          // /.row
          br
          .table-responsive
            table.table.border.mb-0
              thead.fw-semibold.text-nowrap
                tr.align-middle
                  th.bg-body-secondary.text-center
                    svg.icon
                      use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-people")
                  th.bg-body-secondary User
                  th.bg-body-secondary.text-center Country
                  th.bg-body-secondary Usage
                  th.bg-body-secondary.text-center Payment Method
                  th.bg-body-secondary Activity
                  th.bg-body-secondary
              tbody
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/1.jpg', alt='user@email.com')
                      span.avatar-status.bg-success
                  td
                    .text-nowrap Yiorgos Avraamu
                    .small.text-body-secondary.text-nowrap
                      span New
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-us")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 50%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-success(role='progressbar', style='width: 50%', aria-valuenow='50', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-mastercard")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap 10 sec ago
                  td
                    .dropdown
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/2.jpg', alt='user@email.com')
                      span.avatar-status.bg-danger
                  td
                    .text-nowrap Avram Tarasios
                    .small.text-body-secondary.text-nowrap
                      span Recurring
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-br")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 10%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-info(role='progressbar', style='width: 10%', aria-valuenow='10', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-visa")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap 5 minutes ago
                  td
                    .dropdown
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/3.jpg', alt='user@email.com')
                      span.avatar-status.bg-warning
                  td
                    .text-nowrap Quintin Ed
                    .small.text-body-secondary.text-nowrap
                      span New
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-in")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 74%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-warning(role='progressbar', style='width: 74%', aria-valuenow='74', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-stripe")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap 1 hour ago
                  td
                    .dropdown
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/4.jpg', alt='user@email.com')
                      span.avatar-status.bg-secondary
                  td
                    .text-nowrap Enéas Kwadwo
                    .small.text-body-secondary.text-nowrap
                      span New
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-fr")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 98%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-danger(role='progressbar', style='width: 98%', aria-valuenow='98', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-paypal")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap Last month
                  td
                    .dropdown
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/5.jpg', alt='user@email.com')
                      span.avatar-status.bg-success
                  td
                    .text-nowrap Agapetus Tadeáš
                    .small.text-body-secondary.text-nowrap
                      span New
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-es")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 22%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-info(role='progressbar', style='width: 22%', aria-valuenow='22', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-apple-pay")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap Last week
                  td
                    .dropdown.dropup
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
                tr.align-middle
                  td.text-center
                    .avatar.avatar-md
                      img.avatar-img(src='assets/img/avatars/6.jpg', alt='user@email.com')
                      span.avatar-status.bg-danger
                  td
                    .text-nowrap Friderik Dávid
                    .small.text-body-secondary.text-nowrap
                      span New
                      |  | Registered: Jan 1, 2023
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/flag.svg#cif-pl")
                  td
                    .d-flex.justify-content-between.align-items-baseline
                      .fw-semibold 43%
                      .text-nowrap.small.text-body-secondary.ms-3 Jun 11, 2023 - Jul 10, 2023
                    .progress.progress-thin
                      .progress-bar.bg-success(role='progressbar', style='width: 43%', aria-valuenow='43', aria-valuemin='0', aria-valuemax='100')
                  td.text-center
                    svg.icon.icon-xl
                      use(xlink:href="node_modules/@coreui/icons/sprites/brand.svg#cib-cc-amex")
                  td
                    .small.text-body-secondary Last login
                    .fw-semibold.text-nowrap Yesterday
                  td
                    .dropdown.dropup
                      button.btn.btn-transparent.p-0(type='button', data-coreui-toggle='dropdown', aria-haspopup='true', aria-expanded='false')
                        svg.icon
                          use(xlink:href="node_modules/@coreui/icons/sprites/free.svg#cil-options")
                      .dropdown-menu.dropdown-menu-end
                        a.dropdown-item(href='#') Info
                        a.dropdown-item(href='#') Edit
                        a.dropdown-item.text-danger(href='#') Delete
    // /.col
  // /.row
